$(document).ready(function() {

    IMAGE = new Image();
    IMAGE.src = "tankbrigade-t.png";
    
    var screenStage = new Stage(document.getElementById('screen'));
    var tilesStage = new Stage(document.getElementById('tiles'));
    var blocksStage = new Stage(document.getElementById('blocks'));
	
	var actualCollisionManager = new CollisionManager();
	var actualTiles = new Array(15);
	for(var x = 0; x < 15; x++){
		actualTiles[x] = new Array(15);
	}
	
	var actualBlocks = new Array(15);
	for(x = 0; x < 15; x++){
		actualBlocks[x] = new Array(15);
	}
	
    var blocksCollisionManager = new CollisionManager();
    var tilesCollisionManager = new CollisionManager();
    var blocks = [];
    var tiles = [];

    var index = 0;
    for (var i = 1; i < 10; i++) {
        for (var j = 1; j < 10; j++) {
            if (window['BLOCK_TYPE_' + index]) {
                blocks.push(new Block(window['BLOCK_TYPE_' + index++], BLOCK_WIDTH * j - 16, BLOCK_HEIGHT * i - 16, blocksCollisionManager));
            }
        }
    }
    index = 0;
	for (i = 1; i < 10; i++) {
        for (j = 1; j < 10; j++) {
            if (window['TILE_TYPE_' + index]) {
                tiles.push(new Tile(window['TILE_TYPE_' + index++], BLOCK_WIDTH * j - 16, BLOCK_HEIGHT * i - 16, tilesCollisionManager));
            }
        }
    }
	
	for (i = 1; i < 16; i++) {
        for (j = 1; j < 16; j++) {
            actualTiles[j - 1][i - 1] = new Tile(TILE_TYPE_2, BLOCK_WIDTH * j - 16, BLOCK_HEIGHT * i -16, actualCollisionManager);
        }
    }

    screenStage.addScene({
        init: function() {
        },
        update: function() {
            actualCollisionManager.update();
			for (i = 0; i < 15; i++) {
				for (j = 0; j < 15; j++) {
					if(actualBlocks[j][i]){
						actualBlocks[j][i].update();
					}
				}
			}
            actualCollisionManager.clean();
        },
        render: function(context) {
            for (i = 0; i < 15; i++) {
				for (j = 0; j < 15; j++) {
					actualTiles[j][i].render(context);
				}
			}
			for (i = 0; i < 15; i++) {
				for (j = 0; j < 15; j++) {
					if(actualBlocks[j][i]){
						actualBlocks[j][i].render(context);
					}
				}
			}
        }, 
		click:function(x, y){
			if(currentTile){
				var ax = Math.floor(x/BLOCK_WIDTH);
				var ay = Math.floor(y/BLOCK_HEIGHT);
				actualTiles[ax][ay] = new Tile(currentTile.tileType, BLOCK_WIDTH * (ax + 1) - 16, BLOCK_HEIGHT * (ay + 1) - 16, actualCollisionManager);
			}
			if(currentBlock){
				var ax = Math.floor(x/BLOCK_WIDTH);
				var ay = Math.floor(y/BLOCK_HEIGHT);
				actualBlocks[ax][ay] = new Block(currentBlock.blockType, BLOCK_WIDTH * (ax + 1) - 16, BLOCK_HEIGHT * (ay + 1) - 16, actualCollisionManager);
			}
		}
    });
    
	var currentTile = null;
    tilesStage.addScene({
        init: function() {
        },
        update: function() {
            tilesCollisionManager.update();
            tilesCollisionManager.clean();
        },
        render: function(context) {
            for(var i = 0; i < tiles.length; i++){
                tiles[i].render(context);
            }
            if(currentTile){
                context.strokeStyle = "white";
                context.strokeRect(currentTile.x1, currentTile.y1, currentTile.halfWidth * 2, currentTile.halfHeight * 2);
            }
        },
        click: function(x, y) {
            var self = this;
            tilesCollisionManager.objects.push({
                x: x,
                y:y,
                halfWidth:0,
                halfHeight:0,
                x1:this.x - this.halfWidth,
                x2:this.x + this.halfWidth,
                y1:this.y - this.halfHeight,
                y2:this.y + this.halfHeight,
                dx:0,
                dy:0,
                remove:false,
                visible :false,
                onCollide: function(obj){
                    if(obj instanceof Tile){
					    currentBlock = null;
                        currentTile = obj; 
                    }
                    this.remove = true;
                }
            });
        }
    });
    
	currentBlock = null;
    blocksStage.addScene({
        init: function() {
        },
        update: function() {
            blocksCollisionManager.update();
            for(var i = 0; i < blocks.length; i++){
                blocks[i].update();
            }
            blocksCollisionManager.clean();
        },
        render: function(context) {
            for(var i = 0; i < blocks.length; i++){
                blocks[i].render(context);
            }
            if(currentBlock){
                context.strokeStyle = "white";
                context.strokeRect(currentBlock.x1, currentBlock.y1, currentBlock.halfWidth * 2, currentBlock.halfHeight * 2);
            }
        },
        click: function(x, y) {
            var self = this;
            blocksCollisionManager.objects.push({
                x: x,
                y:y,
                halfWidth:0,
                halfHeight:0,
                x1:this.x - this.halfWidth,
                x2:this.x + this.halfWidth,
                y1:this.y - this.halfHeight,
                y2:this.y + this.halfHeight,
                dx:0,
                dy:0,
                remove:false,
                visible :false,
                onCollide: function(obj){
                    if(obj instanceof Block){
						currentTile = null;
                        currentBlock = obj; 
                    }
                    this.remove = true;
                }
            });
        }
    });

    $('#screen').attr('width', STAGE_MAX_X).attr('height', STAGE_MAX_Y).focus();
    $('#tiles').attr('width', BLOCK_WIDTH * 10).attr('height', BLOCK_HEIGHT * 7);
    $('#blocks').attr('width', BLOCK_WIDTH * 10).attr('height', BLOCK_HEIGHT * 6);
    screenStage.start();
    tilesStage.start();
    blocksStage.start();
});